<template>
  <div>
    <!-- 选择开设专业 -->
    <el-cascader
      v-model="value"
      :options="majorData"
      :props="{
        expandTrigger: 'hover',
        children: 'childList',
        label: 'name',
        value: 'code',
        multiple: multiple,
        checkStrictly: true,
      }"
      @change="handleChange"
      clearable
      filterable
      style="width: 100%"
      placeholder="请选择专业方向"
    ></el-cascader>
  </div>
</template>
<script>
import { eduMajorsQuery } from '@/api/admin/teach/eduMajors.js'
export default {
  data() {
    return {
      value: [],
      options: [],
      listQuery: {
        page: 1,
        limit: 9999,
        pid: 0,
        deptId: '',
      },
      majorData: [], //专业方向
    }
  },
  props: ['defaultValue', 'deptId', 'multiple'],
  watch: {
    defaultValue: {
      immediate: true,
      handler(v) {
        this.value = v
      },
    },
  },
  mounted() {
    this.getList()
  },
  methods: {
    getList() {
      eduMajorsQuery(this.listQuery).then((res) => {
        this.majorData = res.data.data
        this.majorData.forEach((v) => {
          if (v.childList.length == 0) {
            delete v.childList
          } else {
            v.childList.forEach((m) => {
              delete m.childList
            })
          }
        })
      })
    },
    handleChange(value) {
      this.$emit('emit', value, this.majorData)
    },
  },
}
</script>